/*
 * Created: 2022-09-13 19:49:10
 * Author : 涛涛涛
 */

import React, { ComponentType, FC, useMemo, useState } from 'react';
import { View, Text, Input, InputProps } from '@tarojs/components';
import { styled } from 'linaria/react';
import { useClassName } from '@/utils/index';
import { JYInputContext } from './JYInputContext';
import InnerInput from './InnerInput/InnerInput';
import InputWrap from './InputWrap/InputWrap';
type LocalCompProps = ICompProps & Omit<InputProps, 'onFocus' | 'onBlur' | 'onChange'>;
export interface IProps extends LocalCompProps {
    onChange?: (val: string) => void;
    onFocus?: (val: string) => void;
    onBlur?: (val: string) => void;
    ref?: React.ForwardedRef<ComponentType<InputProps>>;
}
const JYInput = React.forwardRef(function (props: IProps, inputRef: React.ForwardedRef<ComponentType<InputProps>>) {
    const { className, style } = props;
    const localClassName = useClassName('JYInput', className);
    const [isFocus, setIsFocus] = useState(false);
    return (
        <JYInputContext.Provider value={{ setIsFocus }}>
            <RootView className={localClassName} style={style}>
                <InputWrap isFocus={isFocus}>
                    <InnerInput {...props} ref={inputRef} setIsFocus={setIsFocus}></InnerInput>
                </InputWrap>
            </RootView>
        </JYInputContext.Provider>
    );
});
JYInput.defaultProps = {} as Partial<IProps>;

export default React.memo(JYInput as FC<IProps>);
const RootView = styled(View)`
    &.JYInput {
        .Input {
            font-size: 28px;
        }
    }
`;
